<template>
    <div id="good-list">
        <van-cell-group inset class="mt20">
            <van-search v-model="formData.key" show-action placeholder="请输入搜索关键词" @search="onSearch()">
                <template #action>
                    <div @click="onRefresh()" class="btn-search">搜索</div>
                </template>
            </van-search>
        </van-cell-group>
        <van-pull-refresh v-model="refreshing" @refresh="onRefresh()">
            <van-list v-model:loading="loading" :finished="finished" :offset="100" finished-text="没有更多了" @load="loadData()" class="con-wrap">
                <div class="good-item" v-for="item in releaseList" :key="item.id">
                    <a :href="'#/good/detail/' + item.id">
                        <div class="good-item-imgs">
                            <img :src="item.thumb" class="good-item-img" alt="item.title">
                        </div>
                        <h4>{{ item.title }}</h4>
                        <p><span>￥</span>{{ item.price }}</p>
                    </a>
                </div>
            </van-list>
        </van-pull-refresh>
        <a href="#/order/list" class="fixed-btn">
            <img src="/statics/home/images/order-list.png" class="flxed-img" alt="add">
            购买记录
        </a>
    </div>
</template>


<script>
export default {
    name: 'GoodList',
    data() {
        return {
            formData:{
                key:'',
            },
            onLoad:false,
            loading:false,
            finished:false,
            refreshing: false,
            pages:{
                page:0,
                size:10,
            },
            releaseList: [],
        }
    },
    created() { },
    methods: {
        loadData() {
            let self = this;
            if (self.refreshing) {
                self.refreshing = false;
            }
            self.loading = true;
            self.finished = false
            self.$api.order.goods({page: self.pages.page,size: self.pages.size,key:this.formData.key}).then(res => {
                let data = self.pages.page == 1 ? [] : self.releaseList;
                for( var i = 0; i< res.result.length; i ++) {
                    data.push(res.result[i]);
                }
                self.releaseList = data;
                self.pages.page++;
                self.loading = false;
                if (res.result.length < 10) {
                    self.finished = true;
                }
            }).finally(e =>{});
        },
        // 下拉刷新
        onRefresh() {
            // 清空列表数据
            this.finished = false;
            this.loading = true;
            this.refreshing = true;
            this.pages.page = 1;
            this.loadData();
        },
    }
}
</script>
